<template>
	<view>
		<block v-if="isFind">
			<myNotice v-if="noticeList.length!=0" :noticeList="noticeList" :uid="userInfo.uid"></myNotice>
			<view v-else class="empty">
				<span>还没有人与您互动过哦</span>
			</view>
		</block>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				noticeList: [],
				noticeDate: '2099-12-31',
				noticeNid: '',
				isLoading: false,
				isFind: false
			};
		},

		onLoad() {
			uni.removeTabBarBadge({
				index: 2
			})
		},
		created() {
			this.getNoticeList()
		},
		onPullDownRefresh() {
			this.noticeList = []
			this.noticeDate = '2099-12-31'
			this.noticeNid = ''
			this.isFind = false
			this.getNoticeList(() => uni.stopPullDownRefresh())
		},
		onReachBottom() {
			if (this.isLoading) return
			this.getNoticeList()
		},
		methods: {
			async getNoticeList(cb) {

				this.isLoading = true

				if (this.noticeList.length != 0 && this.noticeList.length % 10 != 0) {
					uni.showToast({
						title: '没有更多数据数据',
						duration: 1500,
						icon: 'none'
					})
					return
				}

				let {
					data: res
				} = await uni.$http.get('/notices?date=' + this.noticeDate + '?nid=' + this.noticeNid)

				cb && cb()
				this.isFind = true

				this.isLoading = false
				if (res.code == 2000) {
					this.noticeList = [...this.noticeList, ...res.data]
					this.noticeDate = res.data[0].date
					this.noticeNid = res.data[0].nid
					uni.setStorageSync('nDate', JSON.stringify(this.noticeDate))

				} else {
					uni.showToast({
						title: '数据加载出错',
						duration: 1500,
						icon: 'error'
					})
				}
				if (res.code == 2000) {
					this.noticeList = [...this.noticeList, ...res.data]
					this.noticeDate = res.data[res.data.length - 1].date
				} else {
					uni.showToast({
						title: '数据加载出错',
						duration: 1500,
						icon: 'error'
					})
				}
			}
		}
	}
</script>

<style lang="less">
	.empty {
		display: flex;
		justify-content: center;
		align-items: flex-end;
		font-size: 14px;
		color: #dedede;
		width: 100%;
		height: 300px;
		background: url('@/static/images/empty-image-default.png') no-repeat;
		background-size: 50%;
		background-position: 50% 50%;
	}
</style>
